package com.example.composableexample.canvas

import android.graphics.Paint
import android.graphics.Typeface
import androidx.compose.animation.core.LinearEasing
import androidx.compose.animation.core.RepeatMode
import androidx.compose.animation.core.animateFloat
import androidx.compose.animation.core.infiniteRepeatable
import androidx.compose.animation.core.rememberInfiniteTransition
import androidx.compose.animation.core.tween
import androidx.compose.foundation.Canvas
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.rotate
import androidx.compose.ui.geometry.CornerRadius
import androidx.compose.ui.geometry.Offset
import androidx.compose.ui.geometry.Size
import androidx.compose.ui.graphics.Brush
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.Path
import androidx.compose.ui.graphics.StrokeCap
import androidx.compose.ui.graphics.drawscope.Stroke
import androidx.compose.ui.graphics.nativeCanvas
import androidx.compose.ui.graphics.toArgb
import androidx.compose.ui.platform.LocalContext
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp


@Preview
@Composable
fun WeatherIcon() {
    val backgroundColor = listOf(Color(0xff2078ee), Color(0xff74e6fe))
    val sunColor = listOf(Color(0xffffc200), Color(0xffffe100))

    Canvas(
        modifier = Modifier
            .size(100.dp)
            .padding(16.dp)
    ) {
        val width = size.width
        val height = size.height
        val path = Path().apply {
            moveTo(x = width.times(0.76f), y = height.times(0.72f))
            cubicTo(
                x1 = width.times(0.93f),
                y1 = height.times(0.72f),
                x2 = width.times(0.98f),
                y2 = height.times(0.41f),
                x3 = width.times(0.76f),
                y3 = height.times(0.40f)
            )
            cubicTo(
                x1 = width.times(0.75f),
                y1 = height.times(0.21f),
                x2 = width.times(0.35f),
                y2 = height.times(0.21f),
                x3 = width.times(0.38f),
                y3 = height.times(0.50f)
            )
            cubicTo(
                x1 = width.times(0.25f),
                y1 = height.times(0.50f),
                x2 = width.times(0.20f),
                y2 = height.times(0.69f),
                x3 = width.times(0.41f),
                y3 = height.times(0.72f)
            )
            close()
        }
        drawRoundRect(
            brush = Brush.verticalGradient(colors = backgroundColor),
            cornerRadius = CornerRadius(50f, 50f)
        )
        drawCircle(
            brush = Brush.verticalGradient(colors = sunColor),
            radius = width.times(0.17f),
            center = Offset(x = width.times(0.35f), y = height.times(0.35f))
        )
        drawPath(path = path, color = Color.White.copy(alpha = 0.9f))
    }
}

@Preview
@Composable
fun InstagramIcon() {
    val instColors = listOf(Color.Yellow, Color.Red, Color.Magenta)
    Canvas(
        modifier = Modifier
            .size(100.dp)
            .padding(16.dp)
    ) {
        // 外边椭圆
        drawRoundRect(
            brush = Brush.linearGradient(colors = instColors),
            cornerRadius = CornerRadius(60f, 60f),
            style = Stroke(width = 15f, cap = StrokeCap.Round)
        )
        // 中间圆形
        drawCircle(
            brush = Brush.linearGradient(colors = instColors),
            radius = 45f,
            style = Stroke(width = 15f, cap = StrokeCap.Round)
        )

        drawCircle(
            brush = Brush.linearGradient(colors = instColors),
            radius = 13f,
            center = Offset(this.size.width * 0.8f, this.size.height * 0.2f)
        )

    }
}

@Preview
@Composable
fun FacebookIcon() {
    val assetManager = LocalContext.current.assets
    val paint = Paint().apply {
        textAlign = Paint.Align.CENTER
        textSize = 200f
        color = Color.White.toArgb()
        typeface = Typeface.createFromAsset(assetManager, "FACEBOLF.OTF")
    }
    Canvas(
        modifier = Modifier
            .size(100.dp)
            .padding(16.dp)
    ) {
        drawRoundRect(
            color = Color(0xff1776d1),
            cornerRadius = CornerRadius(20f, 20f)
        )
        drawContext.canvas.nativeCanvas.drawText("f", center.x + 25, center.y + 90, paint)
    }
}

@Preview
@Composable
fun MessagerIcon() {
    val colors = listOf(Color(0xff02b8f9), Color(0xff0277fe))
    Canvas(
        modifier = Modifier
            .size(100.dp)
            .padding(16.dp)
    ) {
        val trianglePath = Path().let {
            it.moveTo(this.size.width * 0.2f, this.size.height * 0.77f)
            it.lineTo(this.size.width * 0.2f, this.size.height)
            it.lineTo(this.size.width * 0.37f, this.size.height * 0.9f)
            it.close()
            it
        }

        val electricPath = Path().let {
            it.moveTo(this.size.width * 0.2f, this.size.height * 0.6f)
            it.lineTo(this.size.width * 0.45f, this.size.height * 0.35f)
            it.lineTo(this.size.width * 0.56f, this.size.height * 0.46f)
            it.lineTo(this.size.width * 0.78f, this.size.height * 0.35f)
            it.lineTo(this.size.width * 0.54f, this.size.height * 0.60f)
            it.lineTo(this.size.width * 0.43f, this.size.height * 0.45f)
            it.close()
            it
        }

        drawOval(
            brush = Brush.verticalGradient(colors = colors),
            size = Size(width = this.size.width, height = this.size.height * 0.95f)
        )

        drawPath(
            path = trianglePath,
            brush = Brush.verticalGradient(colors = colors)
        )

        drawPath(path = electricPath, color = Color.White)

    }
}

@Preview
@Composable
fun GooglePhotosIcon() {


    val animateTween by rememberInfiniteTransition().animateFloat(
        initialValue = 0f,
        targetValue = 360f,
        animationSpec = infiniteRepeatable(
            tween(durationMillis = 5000, easing = LinearEasing),
            RepeatMode.Restart
        )

    )

    Box {
        Canvas(
            modifier = Modifier
                .align(Alignment.Center)
                .size(100.dp).padding(16.dp)
                .rotate(animateTween)
        ) {
            drawLine(
                Color.Blue,
                start = Offset(x = 0f, y = size.height),
                end = Offset(x = size.width, y = size.height)
            )
            drawArc(
                color = Color(0xfff04231),
                startAngle = -90f,
                sweepAngle = 180f,
                useCenter = true,
                size = Size(size.width * 0.5f, size.height * 0.5f),
                topLeft = Offset(size.width * 0.25f, 0f)
            )
            drawArc(
                color = Color(0xff4385f7),
                startAngle = 0f,
                sweepAngle = 180f,
                useCenter = true,
                size = Size(size.width * 0.5f, size.height * 0.5f),
                topLeft = Offset(size.width * 0.5f, size.height * 0.25f)
            )
            drawArc(
                color = Color(0xff30a952),
                startAngle = 0f,
                sweepAngle = -180f,
                useCenter = true,
                size = Size(size.width * 0.5f, size.height * 0.5f),
                topLeft = Offset(0f, size.height * 0.25f)
            )
            drawArc(
                color = Color(0xffffbf00),
                startAngle = 270f,
                sweepAngle = -180f,
                useCenter = true,
                size = Size(size.width * 0.5f, size.height * 0.5f),
                topLeft = Offset(size.width * 0.25f, size.height * 0.5f)
            )
//        drawArc(
//            color = Color.Magenta,
//            size = Size(size.width, size.height),
//            startAngle = 180f,
//            sweepAngle = -350f,
//            useCenter = true,
//            topLeft = Offset(x = 0f, y = size.width * 0.5f)
//        )
//
//        drawArc(
//            brush = ShaderBrush(
//                shader = LinearGradientShader(
//                    from = Offset(x = 0.3f, y = 0.3f),
//                    to = Offset(x = size.width, y = size.height),
//                    colors = listOf(
//                        Color.Magenta, Color(0xFF00B8D4), Color(0xFFFFD600), Color(
//                            0xFFFF6D00
//                        )
//                    ),
//                    tileMode = TileMode.Repeated
//                )
//            ),
//            startAngle = 0f,
//            sweepAngle = 360f,
//            useCenter = true
//        )
        }
    }


}